<template>
	<view class="page">
		<view class="title">
			4.6.vue3组合式API中的组件的生命周期函数（钩子函数）
		</view>
		<view class="p">
			官网链接API
			<uni-link href="https://cn.vuejs.org/guide/essentials/lifecycle.html" text="生命周期函数"
				color="#007BFF"></uni-link>
		</view>
		<view class="p">
			<scroll-view scroll-x scroll-y="true" class="" ref="scrool"></scroll-view>
		</view>
		<view class="p">
			onLoad：页面加载时触发，可以在此生命周期函数中进行页面初始化操作。
			onShow：页面显示时触发，可以在此生命周期函数中进行页面展示相关的操作。
			onReady：页面初次渲染完成时触发，可以在此生命周期函数中进行页面渲染完成后的操作。
			onHide：页面隐藏时触发，可以在此生命周期函数中进行页面隐藏相关的操作。
			onUnload：页面卸载时触发，可以在此生命周期函数中进行页面卸载相关的操作。
		</view>
		<view class="p">
			声明周期函数主要是作用就是在不同的声明周期做不同的操作，例如onLoad时候可以先做数据请求和数据初始化，并做页面Loading,挂载阶段则进行数据加载，更新则是页面有用户操作的时候进行数据更新。卸载阶段，可以做一些数据的清理或者缓存等，实际的适用场景要根据开发场景不同选择不同的周期函数。
		</view>
	</view>
</template>

<script setup>
	import {
		onMounted,
		ref
	} from 'vue'

	const scrool = ref(null)

	onMounted(() => {
		console.log(scrool.value);
	})
</script>

<style lang="scss" scoped>

</style>